<template>
  <!-- 巡检任务 -->
  <div class="FlPatrolTask">
    <!-- 搜索框-->
    <div style="padding: 0px 0px">
      <!-- 收缩框 -->
      <!-- <div class="shrinkBox" @click="shrinkBoxOpenClose = !shrinkBoxOpenClose">
        <i :class="shrinkBoxOpenClose?'el-icon-arrow-up':'el-icon-arrow-down'" v-if="numSearch>8"></i>
      </div> -->
      <!-- @clearSearch='clearSearch' -->
      <!-- <div style="border-top:1px solid #E6E6E6;margin:0px 20px;"></div> -->
      <div class="right_row" style="padding: 25px 30px">
        <div class="right_shou">
          <searchComponentsCss
            :searchData="mingchensearchData"
            :optionsZi="optionsZi"
            :searchOptionTable="searchOptionTable"
            :shrinkBoxOpenClose="shrinkBoxOpenClose"
            @searchCallBack="searchCallBack"
          ></searchComponentsCss>
        </div>
        <rightButtons
          class="right_buttons"
          @sunS_F="sunS_F"
          @emptySearch="emptySearch"
          @configuration="configuration"
          @goFatherComponent="goFatherComponent"
          :configurationData="searchData"
          :btn-switch-configuration="false"
        ></rightButtons>
        <!--新增按钮-->
        <div class="right_you">
          <!-- <buttonxingjian
            v-if="but_add"
            class="buttonhurdle"
            :diaDataAdd="xinjiansearchData"
            :optionsZi="optionsZi"
            :searchOptionTable="searchOptionTable"
            :multipleSelection="multipleSelection"
            :xunjianjihuaxinjian="true"
            @toAdd="toAdd"
          ></buttonxingjian> -->
          <el-button
            type="primary"
            plain
            size="small"
            icon="el-icon-video-play"
            @click="startPlan()"
            >开始</el-button
          >
          <el-button
            type="warning"
            plain
            size="small"
            icon="el-icon-circle-check"
            @click="stopPlan()"
            >完成</el-button
          >
          <!-- 导出 Derived form-->
          <derivedTbale
            v-if="but_derivedTbale"
            class="importX"
            :suoS="suoS"
            :disabled="disabled"
            :multipleSelection="multipleSelection"
          />
          <!--批量删除按钮-->
          <batches
            v-if="but_delBatches"
            class="buttonhurdle"
            @toDelete="toDelete"
          >
          </batches>
        </div>
      </div>
    </div>
    <!-- 表格 -->
    <div class="out">
      <!--数据列表-->
      <!-- 字典 -->
      <dictionariesPlus
        :searchData="searchData"
        :modelType="modelType"
        @optionData="dictionariesCallBack"
      ></dictionariesPlus>
      <el-table
        ref="multipleTable"
        :data="dataAttribute"
        v-loading.body="false"
        border
        fit
        highlight-current-row
        size="mini"
        :cell-style="{ padding: '5px 0' }"
        @selection-change="handleSelectionChange"
        @sort-change="sortChangeTable"
        max-height="511px"
      >
        <el-table-column
          align="center"
          type="selection"
          :show-overflow-tooltip="true"
          width="45"
        ></el-table-column>
        <el-table-column
          align="center"
          label="序号"
          type="index"
          :index="indexMethod"
          width="54px"
        >
        </el-table-column>
        <el-table-column
          align="center"
          v-for="item in searchData"
          :v-if="item.tableSign"
          :key="item.id"
          :label="item.CN"
          :prop="item.EN"
          :sortable="customMethod(item)"
          :show-overflow-tooltip="true"
          min-width="140px"
        >
          <template slot-scope="scope">{{
            item.type === "select"
              ? optionDatas(
                  item.typeGroupCode
                    ? optionsZi[item.EN]
                    : searchOptionTable[item.EN],
                  scope.row[item.EN]
                )
              : scope.row[item.EN]
          }}</template>
        </el-table-column>
        <el-table-column
          align="center"
          label="巡检结果"
          width="180px"
          fixed="right"
          v-if="but_look || but_edit || but_del"
        >
          <template slot-scope="scope" class="do">
            <!-- 查看按钮 -->
            <el-button
              v-if="but_look"
              style="color: #0b9ac3; border: none"
              icon="el-icon-view"
              circle
              @click="makeExaId(scope.row)"
            ></el-button>
            <!-- 修改组件 -->
            <!-- <modificationi
              v-if="but_edit"
              class="inline_block"
              :attributeOrder="searchData"
              :optionsZi="optionsZi"
              :searchOptionTable="searchOptionTable"
              :modData="scope.row"
              @modifyData="modifyData"
            ></modificationi> -->
            <!-- 删除按钮 -->
            <!-- <el-button
              v-if="but_del"
              style="color: #c90010; border: none"
              icon="el-icon-delete"
              circle
              @click="deleteList(scope.row.id)"
            ></el-button> -->
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        class="pagination"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pagetotal"
      ></el-pagination>
    </div>

    <!-- 查看组件 -->
    <examine
      :DialogVisibleMod="DialogVisibleExamine"
      :modData="examineData"
      :optionsZi="optionsZi"
      :searchOptionTable="searchOptionTable"
      :attributeOrder="searchData"
      @examineDialog="examineDialog"
    ></examine>

    <div class="chouti">
      <el-drawer
        title="巡检结果"
        :visible.sync="drawer"
        direction="rtl"
        :before-close="handleClose"
      >
        <div>新增报障：</div>

        <el-input
          placeholder=""
          v-model="Newbarrier"
          :disabled="true"
          style="width: 35%"
        >
        </el-input>
        <div class="chouti_yan">• 签到点详情({{wangcdianshu}}/{{dianshu}})</div>
        <div class="chouti_leibiao">
          <el-table
            ref="singleTable"
            :data="tableData"
            @current-change="handleCurrentChanges"
            style="width: 100%"
          >
            <el-table-column type="index" width="20"> </el-table-column>
            <el-table-column label="签到点位置" align="center" show-overflow-tooltip>
              <template slot-scope="scope">
                <i class="el-icon-location"></i>
                <span style="margin-left: 10px">{{ scope.row.signAddress }}</span>
              </template>
            </el-table-column>
            <el-table-column property="signDate" label="签到时间" align="center">
            </el-table-column>
            <el-table-column label="现场情况" width="50">
              <template slot-scope="scope">
                <u @click="chakan(scope.row)">查看</u>
              </template>
            </el-table-column>
          </el-table>
        </div>

        <!-- 地图 -->
        <div class="chouti_yan">• 巡检轨迹</div>
        <div id="map_boxs" class="map_boxs"></div>
      </el-drawer>
    </div>
    <el-dialog title="签到点详情" :visible.sync="dialogTableVisible">
      <div class="chouti_xian">
        <span>签到位置：</span
        ><span>{{realSignAddress}}</span>
      </div>
      <div class="chouti_xian">
        <span>签到点：</span
        ><span>
          {{LongLat}}
         </span>
      </div>
      <div class="chouti_xian">
        <span>现场照片：</span
        ><span class="chouti_xian_img">
          <div v-for="(item, i) in imgs" :key="i" >
          <el-image
            style="width: 100px; height: 100px"
            :src="item" 
            :preview-src-list="imgs"
          >
          </el-image>
          </div>
         
        </span>
      </div>
      <div class="chouti_xian">
        <span>备注：</span
        ><span>
          <el-input
            v-model="patrolRmk"
            type="textarea"
            :rows="2"
          ></el-input
        ></span>
      </div>
    </el-dialog>
  </div>
</template>
<script>
//引入组件
import {
  SearchCForL,
  searchComponents,
  searchComponentsCss,
  examine,
  rightButtons,
  dictionaries,
  dictionariesPlus,
  // importXlsx
} from "@/views/components/FLPage";
//引入组件
import {
  buttonhurdle,
  importXlsx,
  batches,
  derivedTbale,
  importTbale,
  modificationi,
  downloadTemplate,
} from "@/views/components/revenueFLpage";
import {
  SAVE_CHECK_BOXS,
  GAIN_CHECK_BOXS,
} from "@/views/components/FLPage/fun/checkBoxFun";
import {
  addFlPatrolTask, //增加
  deleteFlPatrolTask, //删除
  searchFlPatrolTask, //分页查询
  modifyFlPatrolTask, //修改
  getFlPatrolTask, //根据ID获取
  exprotXls, //导出xlsx数据
  downTem, //导出下载模板
  finishPatrolTask, //完成任务
  startPatrolTask, //开始任务
  searchflPatrolPlanPoint, //查询签到点接口
  flPatrolTaskPoints,//巡检任务签到点
} from "@/api/xiaofang/base/flPatrolTask/index";
import { img1 } from "@/img/dianwei.png";
export default {
  components: {
    buttonhurdle,
    modificationi,
    examine,
    searchComponents,
    searchComponentsCss,
    importXlsx,
    rightButtons,
    dictionaries,
    dictionariesPlus,
    batches,
    derivedTbale,
    importTbale,
    downloadTemplate,
  },
  name: "FlPatrolTask",
  data() {
    return {
      but_add: true,
      but_delBatches: true,
      but_look: true,
      but_edit: true,
      but_del: true,
      but_derivedTbale: true,
      but_importTbale: true,
      but_downloadTemplate: true,
      drawer: false, //抽屉
      Newbarrier: 1, //新增报障
      map: null, //地图实例
      geocoder: null,
      tableData: [
        
      ], //模拟数据
      dianshu:'',
      wangcdianshu:"",
      dialogTableVisible: false, //查看弹框
      markers: [], //签到点点位数据
      imgs: [],
      realSignAddress:'',
      LongLat:'',
      patrolRmk:'',
      dizhi: "https://test.fenglankeji.cn",
      routePoints: [], //巡检路线线路
      currentRow: null,
      // lookOver:true,
      // editField:true,
      // Deletebu:true,
      disabled: false,
      numSearch: 0,
      //   收缩框开关
      shrinkBoxOpenClose: false,
      importUrl: "api/schedule/flPatrolTask/importXls",
      //搜索框
      suoS: {},
      //   搜索组件的数据 columnSize
      searchData: [
        {
          EN: "taskNo",
          CN: "巡检任务编号",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        // {
        //   EN: "latestTaskTermId",
        //   CN: "最新的任务期次id",
        //   value: "",
        //   type: "input",
        //   option: [],
        //   err: "长度为2-20位的所有字符!",
        //   Exp: "^.{2,20}$",
        //   result: true,
        //   sign: true,
        //   searchSign: true,
        //   addSign: true,
        //   tableSign: true,
        //   examineSign: true,
        //   examineDisabled: false,
        //   modificationSign: true,
        //   configurationSign: true,
        // },
        {
          EN: "planName",
          CN: "对应巡检计划",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "patrolTaskStatus",
          CN: "任务状态",
          value: "",
          type: "select",
          option: [],
          err: "长度为1-3位的数字!",
          Exp: "^[0-9]+(\\.[0-9]{1,3})?$",
          typeGroupCode: "patrol_task_status",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "patrolOrganization",
          CN: "巡检区域",
          value: "",
          type: "select",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          dictTable: {
            table: "fl_community",
            id: "code",
            name: "name",
          },
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "patrolByName",
          CN: "巡检人员",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "patrolRouteType",
          CN: "巡检路线",
          value: "",
          type: "select",
          option: [],
          err: "长度为1-3位的数字!",
          Exp: "^[0-9]+(\\.[0-9]{1,3})?$",
          typeGroupCode: "patrol_route_type",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "startDt",
          CN: "任务开始时间",
          value: "",
          type: "date",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "endDt",
          CN: "任务结束日期",
          value: "",
          type: "date",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "signPointCount",
          CN: "签到点个数",
          value: "",
          type: "input",
          option: [],
          err: "长度为1-10位的数字!",
          Exp: "^[0-9]+(\\.[0-9]{1,10})?$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "realStartDt",
          CN: "实际开始时间",
          value: "",
          type: "date",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "realEndDt",
          CN: "实际结束日期",
          value: "",
          type: "date",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "completionRate",
          CN: "完成率",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "inPlaceRate",
          CN: "到位率",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
        {
          EN: "inTimeRate",
          CN: "及时率",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
      ],
      mingchensearchData: [
        {
          EN: "planName",
          CN: "对应巡检计划",
          value: "",
          type: "input",
          option: [],
          err: "长度为2-20位的所有字符!",
          Exp: "^.{2,20}$",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          configurationSign: true,
        },
      ],

      //添加弹窗的数据模型
      // diaDataAdd: {
      //   yyqName: "",00
      //   pqName: "",
      //   pqNum: "",
      //   BH: "",
      // },
      //删除----Start--------------------------------------
      deleteDataList: [],
      //删除----End----------------------------------------

      //查看----Start--------------------------------------

      //查看的弹窗控制器
      DialogVisibleExamine: false,

      //查看的数据
      examineData: {},

      //查看----End----------------------------------------

      //表格数据
      //后端传来的数据
      dataAttribute: [],
      //表格选中1
      multipleSelection: [],

      //分页
      currentPage: 1, //当前页
      pagesize: 10, //每页条数
      pagetotal: 0, //总条数,
      modelType: "table",
      optionsZi: [],
      searchOptionTable: [],
    };
  },
  computed: {
    optionDatas() {
      return function (arr, val) {
        if (arr) {
          for (let i = 0; i < arr.length; i++) {
            if (arr[i].value == val) {
              return arr[i].label;
            }
          }
        }
      };
    },
    customMethod() {
      return function (item) {
        return "custom";
      };
    },
  },
  async created() {
    // 按钮权限配置
    // this.but_add = this.$store.state.user.elements['flPatrolTask:but_add'];
    // this.but_delBatches = this.$store.state.user.elements['flPatrolTask:but_delBatches'];
    // this.but_look = this.$store.state.user.elements['flPatrolTask:but_look'];
    // this.but_edit = this.$store.state.user.elements['flPatrolTask:but_edit'];
    // this.but_del = this.$store.state.user.elements['flPatrolTask:but_del'];
    // this.but_derivedTbale = this.$store.state.user.elements['flPatrolTask:but_derivedTbale'];
    // this.but_importTbale = this.$store.state.user.elements['flPatrolTask:but_importTbale'];
    // this.but_downloadTemplate = this.$store.state.user.elements['flPatrolTask:but_downloadTemplate'];
    // ------------------
    // this.but_search = this.$store.state.user.elements['flPatrolTask:but_search'];
    // this.but_reset = this.$store.state.user.elements['flPatrolTask:but_reset'];
    // this.but_pz = this.$store.state.user.elements['flPatrolTask:but_peizhi'];

    //获取保存的’配置‘
    //1.ajax
    // this.init();

    this.getSSearchNum();
    let userId = this.$store.state.user.id;
    let routerName = this.$route.path;
    let peizhiData = await GAIN_CHECK_BOXS(userId, routerName);
    //2.判断数据库里面是否有 以前存过的配置信息
    if (peizhiData != "") {
      //3.解析(序列化)
      this.searchData = JSON.parse(peizhiData);
    }
  },
  mounted() {
    // this.init();
  },
  watch: {
    markers() {
      this.$nextTick(() => {
        // this.routePoints
        this.init();
      });
    },
    // routePoints() {
    //    this.$nextTick(() => {
    //     // this.routePoints
    //     this.init();
    //   });
    // }
  },

  methods: {
    //查看
    chakan(rwshujdata) {
      let arrimg = rwshujdata.imagesPath.split(',')
        let sss = arrimg.map(i => {
          return this.dizhi + i
        })
        this.imgs = sss
      console.log(rwshujdata);
      this.realSignAddress= rwshujdata.realSignAddress
      this.LongLat = `${rwshujdata.realLongitude},${rwshujdata.realLatitude}`
      this.patrolRmk=rwshujdata.patrolRmk
      this.dialogTableVisible = true;
    },
    // 地图
    init() {
      var that = this;
      that.map = new AMap.Map("map_boxs", {
        rotateEnable: true,
        resizeEnable: true,
        pitchEnable: true,
        zoom: 14,
        pitch: 75,
        rotation: -15,
        // center: [116.205467, 39.907761],
        terrain: true,
        // autoFitView: true,
      });

      var endIcon = new AMap.Icon({
        size: new AMap.Size(25, 34),
        image: require("@/img/dianwei.png"),
        imageSize: new AMap.Size(135, 40),
        imageOffset: new AMap.Pixel(-95, -3),
      });
      that.markers.forEach(function (marker) {
        // console.log(marker);
        new AMap.Marker({
          map: that.map,
          // icon: endIcon,
          position: [marker.position[0], marker.position[1]],
          offset: new AMap.Pixel(-13, -30),
        });
      });

      var polyline1 = new AMap.Polyline({
        path: that.routePoints ,
        isOutline: true,
        outlineColor: "#ffeeff",
        borderWeight: 3,
        strokeColor: "#3366FF",
        strokeOpacity: 1,
        strokeWeight: 6,
        // 折线样式还支持 'dashed'
        strokeStyle: "solid",
        // strokeStyle是dashed时有效
        strokeDasharray: [10, 5],
        lineJoin: "round",
        lineCap: "round",
        zIndex: 50,
      });
      if(that.routePoints.length){
        // console.log(that.routePoints,'执行了');
        that.map.add([polyline1]);
      }
      that.routePoints=[]
      
      // that.polyline.setMap(that.map);
      that.map.setFitView();
    },
    handleCurrentChanges(val) {
      this.currentRow = val;
    },
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then((_) => {
          done();
        })
        .catch((_) => {});
    },
    // 搜索框
    getSSearchNum() {
      let searchData = this.searchData;
      let num = 0;
      for (let i = 0; i < searchData.length; i++) {
        const element = searchData[i];
        if (element.searchSign) {
          num += 1;
        } else {
          num = num;
        }
      }
      this.numSearch = num;
    },
    // 排序
    sortChangeTable(obj) {
      // 上升
      let prop = obj.prop;
      // 排序  需求  将驼峰形式的字段 改为 下划线形式的字段
      let abc = prop.replace(/([A-Z])/g, "_$1").toLowerCase();
      if (obj.order === "ascending") {
        let suoS = this.suoS;
        suoS.sortName = abc;
        suoS.sortType = obj.order;
        this.forData(this.currentPage, this.pagesize, suoS); //刷新列表
      } else if (obj.order === "descending") {
        let suoS = this.suoS;
        suoS.sortName = abc;
        suoS.sortType = obj.order;
        this.forData(this.currentPage, this.pagesize, suoS); //刷新列表
        // 下降
      } else {
        // 正常
        let suoS = this.suoS;
        suoS.sortName = abc;
        suoS.sortType = "";
        this.forData(this.currentPage, this.pagesize, suoS); //刷新列表
      }
    },
    handleSuccessImport(newValue) {
      if (newValue == "导入成功") {
        this.forData(this.currentPage, this.pagesize, this.suoS);
      }
    },
    //配置的子组件通知
    async goFatherComponent(OverData) {
      //1.修改父组件的视图***************
      this.searchData = JSON.parse(JSON.stringify(OverData));
      //2.保存’配置‘的更改
      let obj = {};
      //三个参数都是string类型***********
      obj["userId"] = this.$store.state.user.id; //1
      obj["routerName"] = this.$route.path; ///jiChuZiLiao/flBook
      obj["stringData"] = JSON.stringify(OverData); //相当于this.searchData转成了字符串格式    [{"EN":"id","CN":"主键","value":""...
      //封装好的发请求方法*****************
      let save_check_boxs = await SAVE_CHECK_BOXS(obj);
    },
    // 配置
    configuration(msg) {
      if (msg == "配置") {
        console.log(msg);
      }
    },
    // 重置
    emptySearch(msg) {
      if (msg == "重置") {
        this.suoS = {};
        let suoS = this.suoS;
        suoS.communityCode = this.areaCode;
        this.forData(this.currentPage, this.pagesize, suoS);
      }
    },
    // 字典组件回调
    dictionariesCallBack([a = {}, b = {}]) {
      // 正常字典
      this.optionsZi = a;
      // 跨表字典
      this.searchOptionTable = b;
      this.forData(this.currentPage, this.pagesize, this.suoS);
    },
    //搜索
    sunS_F(msg) {
      if (msg == "搜索") {
        this.currentPage = 1;
        this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
      }
    },
    //查询组件回调
    searchCallBack(newData) {
      let obj = {};
      for (let i = 0; i < newData.length; i++) {
        obj[newData[i].EN] = newData[i].value;
      }
      this.suoS = obj;
    },

    //渲染数据初始
    forData(page, size, searchData) {
      this.suoS["listType"] = 1;

      searchFlPatrolTask(page, size, searchData)
        .then((response) => {
          // console.log(response);
          this.pagetotal = response.data.total;
          this.dataAttribute = response.data.list;

          if (this.dataAttribute.length == 0) {
            this.disabled = true;
          } else {
            this.disabled = false;
          }
        })
        .catch((this.disabled = true));
    },
    //添加用户--新增表单组件传来的参数
    toAdd(addData) {
      let obj = {};
      for (let i = 0; i < addData.length; i++) {
        obj[addData[i].EN] = addData[i].value;
      }
      addFlPatrolTask(obj)
        .then((response) => {
          this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
          if (response.flag) {
            this.$message({
              message: response.message,
              type: "success",
            });
          } else {
            this.$message({
              message: response.message,
              type: "warning",
            });
          }
        })
        .catch(() => {
          this.$message.error("添加失败");
        });
    },
    //开始任务
    startPlan() {
      this.$confirm("确认开始该任务？")
        .then((_) => {
          for (let i = 0; i < this.deleteDataList.length; i++) {
            var ids = {
              id: this.deleteDataList[i].id,
            };
          }
          if(ids){
          startPatrolTask(ids)
            .then((response) => {
              console.log(response);
              this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
              if (response.code === 20000) {
                this.$message({
                  message: response.message,
                  type: "success",
                });
              } else if (response.code === 20001) {
                this.$message({
                  message: response.message,
                  type: "warning",
                });
              }
            })
            .catch((error) => {
              this.$message.error("开始任务失败");
            });
          }else{
            this.$message({
                message: "开始失败,请勾选计划",
                type: "warning",
              });
          }
        })
        .catch((_) => {});
    },
    //完成任务
    stopPlan() {
      this.$confirm("确认完成该任务？")
        .then((_) => {
          for (let i = 0; i < this.deleteDataList.length; i++) {
            var idss = {
              id: this.deleteDataList[i].id,
            };
          }
          if(idss){
          finishPatrolTask(idss)
            .then((response) => {
              console.log(response);
              this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
              if (response.code === 20000) {
                this.$message({
                  message: response.message,
                  type: "success",
                });
              } else if (response.code === 20001) {
                this.$message({
                  message: response.message,
                  type: "warning",
                });
              }
            })
            .catch((error) => {
              this.$message.error("任务完成失败");
            });
          }else{
            this.$message({
                message: "完成失败,请勾选计划",
                type: "warning",
              });
          }
        })
        .catch((_) => {});
    },
    //按钮栏传递了删除命令
    toDelete(orderstring) {
      this.$confirm("确认删除？")
        .then((_) => {
          let idArr = [];
          for (let i = 0; i < this.deleteDataList.length; i++) {
            idArr.push(this.deleteDataList[i].id);
          }
          if (idArr.length == 0) {
            this.$message({
              message: "请选择要删除的数据",
              type: "warning",
            });
            return;
          }
          deleteFlPatrolTask(idArr)
            .then((response) => {
              this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
              this.$message({
                message: "删除成功",
                type: "success",
              });
            })
            .catch((error) => {
              this.$message({
                message: "删除失败",
                type: "warning",
              });
            });
        })
        .catch((_) => {});
    },
    //单项删除
    deleteList(id) {
      let arrId = [id];
      this.$confirm("确认删除？")
        .then((_) => {
          deleteFlPatrolTask(arrId).then((response) => {
            this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
            this.$message({
              message: "删除成功",
              type: "success",
            });
          });
          done();
        })
        .catch((_) => {});
    },
    //查看
    makeExaId(id) {
      if (id.routePoints) {
        const ss = id.routePoints;

        const arr2 = ss.split("-");
        // console.log(arr2, "22222222");
        const arr3 = arr2.map((item) => {
         
          return item.split(",");
        });
        // console.log(arr3, "33333333");

        const arr4 = arr3.map((i) => {
          return [i[0] * 1, i[1] * 1];
        });
        this.routePoints = arr4;

        // console.log(this.routePoints);
      }
      
      console.log(id.planId);

      var obj = {
        planId: id.planId,
      };
      var obj1 = {
        taskId: id.id,
        appType:2
      };
      console.log(id);
      this.wangcdianshu=Math.round(id.completionRate*id.signPointCount*0.01)
      // id.completionRate
      this.dianshu=id.signPointCount
      // var planId=id.planId
      flPatrolTaskPoints(obj1).then((res)=>{
        this.tableData =res.data
        
      })
      searchflPatrolPlanPoint(1, 10, obj).then((res) => {
        var zhuan = res.data.list;
        var markerss = zhuan.map((item) => {
          var limian = {
            position: [item.latitude, item.longitude],
          };
          return limian;
        });
        this.markers = markerss;
      });
      
      this.drawer = true;
      // this.init();

      // getFlPatrolTask(id)
      //   .then((response) => {
      //     let copyDialog = false;
      //     this.DialogVisibleExamine = copyDialog;
      //     // console.log(response);
      //     this.examineData = response.data;
      //   })
      //   .catch((error) => {
      //     alert("获取失败");
      //   });
    },
    //查看关闭弹窗
    examineDialog(dialogVisibleMod) {
      this.DialogVisibleExamine = false;
    },

    //修改
    modifyData(value, modData) {
      if (value) {
        let id = modData.id;
        modifyFlPatrolTask(id, modData)
          .then((response) => {
            this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
            if (response.flag) {
              this.$message({
                message: response.message,
                type: "success",
              });
            } else {
              this.$message({
                message: response.message,
                type: "warning",
              });
            }
          })
          .catch((error) => {
            this.$message({
              message: "修改失败",
              type: "warning",
            });
            this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
          });
      } else {
        this.forData(this.currentPage, this.pagesize, this.suoS); //刷新列表
      }
    },
    //表格选中事件
    handleSelectionChange(val) {
      this.multipleSelection = val;
      //传递删除的参数
      this.deleteDataList = val;
    },

    //分页
    handleSizeChange(val) {
      console.log("每页 " + val + " 条");
      this.pagesize = val;
      this.forData(this.currentPage, val, this.suoS);
    },
    handleCurrentChange(val) {
      console.log("当前页: " + val);
      this.currentPage = val;
      this.forData(val, this.pagesize, this.suoS);
    },
    // 序号
    indexMethod(index) {
      var currentPage = this.currentPage;
      var pagesize = this.pagesize;
      this.$nextTick(function () {
        currentPage = this.currentPage;
        pagesize = this.pagesize;
      });
      return currentPage * pagesize - pagesize + 1 + index;
    },
    // 下载模板请求
    exprotXlsx: exprotXls,
    downloadFile: downTem,
    //工具栏组件传来的参数
    // FTableFunction(attributeOrderCloneTwiceL) {
    //   this.attributeOrder = attributeOrderCloneTwiceL;
    // },
  },
};
</script>
<style scoped src="@/styles/allCssP.css"></style>
<style lang="scss" scoped>
.chouti_xian {
  display: flex;
  align-items: center;
  // justify-content:flex-start;
  // justify-content: flex-start;
  padding: 20px 0;
  .chouti_xian_img{
    display: flex;
    flex-wrap:wrap;
    div{
      padding-right: 8px;
    }
  }
  span:nth-child(1) {
    width: 20%;
    text-align: right;
    padding-right: 20px;
  }
  span:nth-child(2) {
    width: 60%;
  }
}
.chouti {
  .chouti_yan {
    margin-top: 20px;
    color: rgb(0, 115, 255);
  }
  .chouti_leibiao {
    u {
      cursor: pointer;
    }
  }
  // width: 120%;
  /deep/.el-table .el-table__cell {
    padding: 0;
  }
  /deep/.el-drawer {
    width: 35% !important;
    margin-top: 70px;
  }
  /deep/.el-dialog__close::before {
    color: #666 !important;
    margin: 0 auto;
    position: absolute;
    top: 25px !important;
    right: 20px;
  }
  /deep/.el-drawer__body {
    padding: 20px;
  }
  #map_boxs {
    border: 1px solid sandybrown;
    height: 31.8vh;
    width: 100%;
    margin: 0 0 10px 0;
    padding: 0;
  }
}
// /deep/.el-dialog__close::before{
//     top: 25px;
//     color: rgb(111, 111, 111);
//   }


/deep/.sout .inner:nth-child(-n + 4) .searchOne .font {
  width: 42%;
}
.FlPatrolTask {
  .shrinkBox {
    text-align: center;
    font-weight: 700;
    font-size: 20px;
    height: 25px;
    // border-bottom:1px solid #E6E6E6;
  }
  /deep/.el-table--mini {
    .gutter {
      display: table-cell !important;
    }
    .el-checkbox__inner {
      width: 12px;
      height: 12px;
    }
    /deep/.el-table__body-wrapper {
      .el-table__body {
        tbody {
          .el-table__row {
            height: 45px !important;
          }
        }
      }
    }
    // 改变表头的高度  改为45px
    .el-table__header-wrapper {
      .el-table__header {
        .has-gutter {
          tr {
            th {
              padding: 5px 0 !important;
              height: 34px;
              line-height: 34px;
            }
          }
        }
      }
    }
    // 表头操作固定定位
    .el-table__fixed-right {
      .el-table__header {
        thead {
          tr {
            th {
              padding: 5px 0 !important;
              height: 34px;
              line-height: 34px;
            }
          }
        }
      }
    }
  }
  .right_row {
    display: flex !important;
    justify-content: start;
    align-items: center;
    .buttonhurdle {
      padding: 0px;
      padding-right: 15px;
    }
    .right_buttons {
      position: absolute;
      right: 30px;
      padding: 0px;
    }
  }
  .right_row {
    display: flex !important;
    justify-content: space-between;
    // justify-content: start;
    align-items: center;
    .right_buttons {
      position: inherit;
    }
    .right_shou {
      .sout[data-v-732bebc5] {
        padding: 0px 0px;
      }
      /deep/.sout .inner:nth-child(-n + 4) .searchOne .font {
        // width: 32%;
        font-size: 12px;
      }
      /deep/.sout .inner:nth-child(-n + 4) {
        width: 100%;
      }
      /deep/.sout{
        padding: 0 0 0 0;
      }
      >>> .inner {
        width: 100%;
      }
      // flex: 0 0 20%;
    }
    .right_you {
      // flex: 0 0 60%;
      display: flex;
      // margin-left: 40%;
      // justify-content: space-between;
      /deep/.el-button--small,
      .el-button--small.is-round {
        padding: 7px 15px;
      }
      /deep/.el-button + .el-button {
        margin-right: 10px;
      }
      /deep/.el-button--danger.is-plain {
        margin-left: 10px;
      }
    }
    .buttonhurdle {
      padding: 0px;
      padding-right: 15px;
      // position: absolute;
      // right: 30px;
    }

    .right_buttons {
      // flex: 0 0 20%;
      margin-left: -23%;
      display: flex;
      left: 30px;
      padding: 0px;
    }
  }
  .do {
    display: flex;
  }
  .pagination {
    text-align: left;
    margin-top: 15px;
  }
}
</style>
